import { InjectionKey } from 'vue'
import { createStore, Store, useStore as baseUseStore } from 'vuex'

import RootStateTypes, { AllStateTypes } from './interface'
import theme from './modules/theme/index'
import user from './modules/user/index'
import tabs from './modules/tabs/index'
import loading from './modules/loading/index'
import browser from './modules/browser/index'

export default createStore<RootStateTypes>({
    modules: {
        theme,
        user,
        tabs,
        loading,
        browser,
    },
})

export const key: InjectionKey<Store<RootStateTypes>> = Symbol('vue-store')

export function useStore<T = AllStateTypes>() {
    return baseUseStore<T>(key)
}
